import React, { useEffect, useState } from 'react'
import { Breadcrumb, Form, Input,  Button,  Row, Col ,Modal} from 'antd';
// import Fetch from '../../../common/Fetch'
import qs from 'qs'
import './Chuyuanbinglidan.css'
import html2canvas from 'html2canvas'
import axios from 'axios'
const layout = {
    labelCol: {
        span: 5,
    },
    wrapperCol: {
        span: 14,
    },
}
const Chuyuanbingrenbingli = (props) => {
    const goback = () => {
        props.history.push("/zy/cybrxx");
    }
    const dayin = () => {
        setVisible(true);
    }
    const [visible, setVisible] = React.useState(false);
    const [modalText, setModalText] = React.useState('确定打印病历单？');
  
    const handleOk = () => {
      setTimeout(() => {
          //2s后开始打印
        setVisible(false);
        let canvasEle=document.getElementById('dayinbinglidan')　　//获取元素
        html2canvas(canvasEle, {
            width: 1200, //设置canvas的宽度
            scale: 1,//缩放
          }).then((canvas) => {
            //处理你生成的canvas
            document.body.appendChild(canvas);
            let a = document.createElement('a');
            a.setAttribute('href', canvas.toDataURL());　　//toDataUrl：将canvas画布信息转化为base64格式图片
            a.setAttribute('download', 'downImg')　　//这个是必须的，否则会报错
            a.setAttribute('target', '_self');
            a.click()
          })

      }, 2000);
    };
  
    const handleCancel = () => {
    //   console.log('Clicked cancel button');
      setVisible(false);
    };
    useEffect(() => {
        const { location } = props
        // console.log({ location });
        let zhuYuanHao = { location }.location.state.zhuYuanHao
        // console.log(typeof (zhuYuanHao), zhuYuanHao);
        getData(zhuYuanHao);
    }, [])
    const [form]=Form.useForm()
    const getData = (zhuYuanHao) => {
        console.log(typeof (zhuYuanHao), zhuYuanHao);
        //请求：
        axios("/bingRenFeiYong/chaXunBingLi",{
            method:"post",
            headers: { "Content-Type": "application/json;charset=UTF-8" },
            params:{zhuYuanHao:zhuYuanHao}
        })
        .then(res=>{
            if(res.data.code===200){
                console.log(res);
                res.data.bingLiJiBenZiLiao[0].ruYuanRiQi=res.data.bingLiJiBenZiLiao[0].ruYuanRiQi.trim().split(" ")[0]
                let formdata=res.data.bingLiJiBenZiLiao[0]
                formdata.nianLin=res.data.nianLin
                formdata.yiShengXingMing=res.data.yiShengXingMing
                console.log(formdata);
                form.setFieldsValue(formdata)
            }
        })
        .catch((err)=>{
            console.log(err);
        })
        // let newzhuYuanHao=qs.stringify({zhuYuanHao:zhuYuanHao})
    //     axios("/renYuanJiBenZiLiao/chaXunFenYe",{
    //         method:"get",
    //        params:{page:1}
    //    })
    //    .then(res=>{
    //        console.log(res)
    //    })
    //    .catch(err=>{
    //        console.log(err)
    //    })
        // fetch("http://172.17.3.246:8870/bingAnShouYe/bingAnShouYe", {
        //     method: "post",
        //     //    url:"/bingAnShouYe/bingAnShouYe",
        //     headers:{ "Content-Type": "application/x-www-form/urlencoded"},
        //     body:"zhuYuanHao="+id
        // })
        //     .then((response) => {
        //         return response.json()
             
        //         //    if(response.data.code===200){

        //         //    }
        //     })
        //     .then((response)=>{
        //          console.log(response);
        //     })
    }
    return (
        <>
            <Breadcrumb style={{ marginBottom: 24 }}>
                <Breadcrumb.Item>出院管理</Breadcrumb.Item>
                <Breadcrumb.Item>病人病历单</Breadcrumb.Item>
            </Breadcrumb>
            <div className="site-layout-background" style={{ padding: 24, margin: 12, minHeight: 300 }}>
                <div id="binglidan">
                    <div id="dayinbinglidan">
                <Row style={{ margin: 12 }}>
                    <Col span={24}>
                        <h1>病人病历单</h1>
                    </Col>
                    <Col span={24} >
                        <Form {...layout} name="nest-messages" form={form}>
                            <Row span={24}>
                            <Col span={8} offset={4}>
                            <Form.Item
                                name='zhuYuanHao'
                                label="住院号"
                                rules={[{}]}>
                                <Input readOnly />
                            </Form.Item>
                            <Form.Item
                                name='xingMing'
                                label="姓名"
                                rules={[{}]}>
                                <Input readOnly />
                            </Form.Item>
                            <Form.Item
                                name='yiShengXingMing'
                                label="医生姓名"
                                rules={[{}]}>
                                <Input readOnly />
                            </Form.Item>
                            <Form.Item
                                name='jiBingZhenDuan'
                                label="疾病诊断"
                                rules={[{}]}>
                                <Input readOnly />
                            </Form.Item>
                            </Col>
                            <Col span={8}>
                            <Form.Item
                                name='nianLin'
                                label="年龄"
                                rules={[{}]}>
                                <Input readOnly />
                            </Form.Item>
                            <Form.Item
                                name='ruYuanRiQi'
                                label="入院时间"
                                rules={[{}]}>
                                <Input readOnly />
                            </Form.Item>
                            <Form.Item
                                name='ruYuanRiQi'
                                label="所属科室"
                                rules={[{}]}>
                                <Input readOnly />
                            </Form.Item>

                            </Col>
                            </Row>
                        </Form>
                    </Col>
                </Row>
                </div>
                <Row style={{ margin: 20 }} justify={"center"} span={24}>
                    <Col span={8} offset={5}>
                        <Button type="primary" onClick={dayin}>打印</Button>
                        <Button type="primary" onClick={goback} style={{marginLeft:80}}>返回</Button>
                        </Col>

                </Row>
                <Modal
                    title=""
                    visible={visible}
                    onOk={handleOk}
                    onCancel={handleCancel}
                >
                    <p>{modalText}</p>
                </Modal>
                </div>
            </div>
        </>
    );
}

export default Chuyuanbingrenbingli;
